<template>
    <section>
        <!--工具条-->
        <el-col :span="24" class="toolbar" style="padding-bottom: 0px;">
            <el-form :inline="true" :model="filters">
                <el-form-item label="运营商" prop="operatoruid">
                    <el-select v-model="filters.operatoruid" clearable filterable placeholder="请选择运营商">
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option
                                v-for="item in operator"
                                :key="item.operatoruid"
                                :label="item.operatorname"
                                :value="item.operatoruid">
                        </el-option>
                    </el-select>
                </el-form-item>

                <el-form-item label="省份" prop="provinceuuid">
                    <el-select v-model="filters.provinceuuid" clearable filterable  placeholder="请选择省份">
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option
                                v-for="item in info"
                                :key="item.provinceuuid"
                                :label="item.provincename"
                                :value="item.provinceuuid">
                            <span style="float: left">{{ item.provincename }}</span>
                            <span style="float: right; color: #8492a6; font-size: 13px">{{ item.label }}</span>
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="业务类型" prop="busuuid">
                    <el-select v-model="filters.busuuid" clearable filterable placeholder="请选择业务类型">
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option
                                v-for="item in bus"
                                :key="item.busuuid"
                                :label="item.busname"
                                :value="item.busuuid">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="分销商" prop="useruuid">
                    <el-select v-model="filters.downId" clearable placeholder="请选择分销商"  filterable >
                        <el-option value="0" label="全部">全部</el-option>
                        <el-option
                                v-for="item in users"
                                :key="item.user.useruuid"
                                :label="item.user.username"
                                :value="item.user.useruuid">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="执行状态" prop="useruuid">
                    <el-select v-model="filters.status" clearable placeholder="请选择执行状态" filterable >
                        <el-option value="-1" label="全部">全部</el-option>
                        <el-option value="0" label="未执行">未执行</el-option>
                        <el-option value="1" label="已执行">已执行</el-option>
                    </el-select>
                </el-form-item>
                <el-form-item>
                    <el-date-picker type="datetime" placeholder="开始时间"  format="yyyy-MM-dd HH:mm:ss"   v-model="filters.starttime" style="width: 100%;"></el-date-picker>
                </el-form-item>
                <el-form-item>
                    <el-date-picker type="datetime" placeholder="结束时间" clearable format="yyyy-MM-dd HH:mm:ss"   v-model="filters.endtime" style="width: 100%;"></el-date-picker>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" v-on:click="queryProductTimerPage">查询</el-button>
                </el-form-item>
            </el-form>
        </el-col>

        <!--列表-->
        <el-table :data="mobiles" highlight-current-row v-loading="listLoading" max-height="620" border  style="width: 100%;">
            <el-table-column type="index" width="80" label="编号">
            </el-table-column>
            <el-table-column prop="operator" label="运营商" show-overflow-tooltip >
            </el-table-column>
            <el-table-column prop="province" label="省份" show-overflow-tooltip >
            </el-table-column>
            <el-table-column prop="busname" label="业务类型" show-overflow-tooltip >
            </el-table-column>
            <el-table-column prop="downName" label="分销名称" show-overflow-tooltip >
            </el-table-column>
            <el-table-column prop="beforeDiscount" label="调价前"  show-overflow-tooltip>
            </el-table-column>
            <el-table-column prop="afterDiscount" label="调价后" show-overflow-tooltip >
            </el-table-column>
            <el-table-column prop="status" label="执行状态" show-overflow-tooltip :formatter="productStatus">
            </el-table-column>
            <el-table-column prop="enabled" label="启用状态" show-overflow-tooltip :formatter="productEnable" >
            </el-table-column>
            <el-table-column prop="executeTime" label="执行时间" show-overflow-tooltip >
            </el-table-column>
            <el-table-column prop="createUser" label="创建人" show-overflow-tooltip >
            </el-table-column>
            <el-table-column prop="createTime" label="创建时间"  show-overflow-tooltip >
            </el-table-column>
            <el-table-column prop="note" label="备注" show-overflow-tooltip >
            </el-table-column>

            <el-table-column label="操作"   fixed="right"width="200">
                <template scope="scope" >
                    <el-button size="small" @click="detailProduct(scope.$index, scope.row)">
                        详情
                    </el-button>
                    <el-button size="small" @click="handleEnable(scope.$index, scope.row)">
                        {{scope.row.enabled == false ? '禁用' : '启用'}}
                    </el-button>
                    <el-button size="small" @click="executeEnable(scope.$index, scope.row)">
                        执行
                    </el-button>
                </template>
            </el-table-column>
        </el-table>
        <el-pagination
                @current-change="handleCurrentChange"
                @size-change="handleSizeChange"
                layout="total,sizes,prev, pager, next"
                :total="total">
        </el-pagination>


        <el-dialog title="详情" size="big" v-model="matchFormBatchLoading" :close-on-click-modal="false">
            <el-form :model="matchBatchForm" :inline="true" label-width="100px"   ref="matchBatchForm">
                <!--列表-->
                <el-table :data="upproductsBatch" highlight-current-row v-loading="listLoading" max-height="470" border
                          ref="multipleTableBatchTimer" show-overflow-tooltip="true" style="width: 100%">
                    <el-table-column type="index" width="70" label="编号">
                    </el-table-column>
                    <el-table-column prop="downName" width="110px" show-overflow-tooltip label="分销商">
                    </el-table-column>
                    <el-table-column prop="productId.downprouuid" show-overflow-tooltip width="120px"   label="产品编码">
                    </el-table-column>
                    <el-table-column prop="productName" show-overflow-tooltip  width="130px" label="产品名称">
                    </el-table-column>
                    <el-table-column prop="productId.price" show-overflow-tooltip  width="110px" label="原价">
                    </el-table-column>
                    <el-table-column prop="beforeDiscount"  width="140px" label="调整前折扣" show-overflow-tooltip>
                    </el-table-column>
                    <el-table-column prop="beforeValue" label="调整前金额"  width="140px" show-overflow-tooltip  >
                    </el-table-column>
                    <el-table-column prop="afterDiscount"   width="140px" show-overflow-tooltip label="调整后折扣">
                    </el-table-column>
                    <el-table-column prop="afterValue"   width="140px" label="调整后金额" show-overflow-tooltip>
                    </el-table-column>
                </el-table>
            </el-form>

        </el-dialog>
    </section>
</template>

<script>
    import util from '../../common/js/util'
    import {
        queryProductTimerPage,
        findAllDownShopInfo,
        updateProductTimer,
        findAllChannel, findAllBus, findOpeProBusShop,
        detailProductTimer,
        executeProductTimer
    } from '../../api/api';
    import moment from 'moment';

    export default {
        data() {
            return {
                filters: {
                    downId:'',
                    provinceuuid: '',
                    busuuid: '',
                    status: '' ,
                    operatoruid: '',
                    starttime:moment().subtract('hour', 6).format('YYYY-MM-DD HH:mm:ss'),
                    endtime:'',
                    createUser:''
                },
                users: [],
                matchBatchRules:[],
                upproductsBatch:[],
                matchBatchForm:{},
                matchFormBatchLoading:false,
                num: 1,
                mobiles:[],
                userUps:[],
                operator: [],
                downfacevalues:[],
                info: [],
                bus: [],
                total: 0,
                start:0,
                pageSize:10,
                listLoading: false,
            }
        },
        methods: {
            productEnable(row){
                return row.enabled == false ? '启用' : '禁用';
            },
            productStatus(row){
                return row.status == 0 ? '未执行' : '已执行';
            },
            findAllDownShopInfo:function(){
                let para = {useruuid: JSON.parse(sessionStorage.getItem("user")).useruuid};
                findAllDownShopInfo(para).then(datas => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        if(data){
                            this.users = data;
                        }
                    }
                });
            },
            findAllUpShopInfo:function(){
                let para = {
                    test:''
                };
                findAllUpShopInfo(para).then(datas =>{
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.userUps = data;
                    }
                });
            },
            queryProductTimerPage() {
                let para = {
                    start: this.start,
                    pageSize: this.pageSize,
                    downName: this.filters.downId == 0 ? "" : this.filters.downId,
                    province: this.filters.provinceuuid == "0" ? "" : this.filters.provinceuuid,
                    busname: this.filters.busuuid == "0" ? "" : this.filters.busuuid,
                    status: this.filters.status == "-1" ? "" : this.filters.status  ,
                    createUser:'',
                    enabled:'',
                    operator: this.filters.operatoruid == "0" ? "": this.filters.operatoruid,
                    starttime: (this.filters.starttime == "" || this.filters.starttime == undefined) ? "" : moment(this.filters.starttime,"YYYY-MM-DD HH:mm:ss").format('YYYY-MM-DD HH:mm:ss'),
                    endtime: (this.filters.endtime == "" || this.filters.endtime == undefined) ? "" : moment(this.filters.endtime,"YYYY-MM-DD HH:mm:ss").format('YYYY-MM-DD HH:mm:ss'),
                };
                //计算分销商名称
                if(this.filters.downId){
                    let name = this.users.find(item => {return item.user.useruuid == this.filters.downId }).user.username;
                    para.downName = name;
                }
                if(this.filters.busuuid){
                    para.busname = this.bus.find(item =>{ return item.busuuid == this.filters.busuuid; }).busname;
                }
                if(this.filters.operatoruid){
                    para.operator = this.operator.find(item =>{ return item.operatoruid == this.filters.operatoruid; }).operatorname;
                }
                if(this.filters.provinceuuid){
                    para.province = this.info.find(item =>{ return item.provinceuuid == this.filters.provinceuuid}).provincename;
                }

                this.listLoading = true;
                queryProductTimerPage(para).then((datas) => {
                    this.listLoading = false;
                    let { message, code, data } = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.mobiles = data.result;
                        this.total = data.totalCount;
                    }
                });
            }
            ,handleCurrentChange:function(val){
                this.start = val - 1;
                this.queryProductTimerPage();
            },
            handleSizeChange:function(val){
                this.pageSize = val;
                this.queryProductTimerPage();
            },
            findAllChannel(){
                let para = {
                    province : ""
                };
                findAllChannel(para).then((datas) => {
                    this.addLoading = false;
                    let { message, code, data } = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    }else if(data){
                        data.forEach(item =>{
                            this.downfacevalues.push({id:item,value:item});
                        });
                    }
                });
            }, findAllBus: function () {
                let para = {useruuid: ''};
                findAllBus(para).then(datas => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.bus = data;
                    }
                });
            },
            findOpeProBusShop(){
                let para = {sdffds: ''};
                findOpeProBusShop(para).then(datas => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.operator = data.operator;
                        this.info = data.info;
                        this.bus = data.bus;
                    }
                });
            },
            handleEnable(index,row) {
                console.log(row);
                this.$confirm('确认禁用或者启用此调价吗?', '提示', {
                    type: 'warning'
                }).then(() => {
                    row.enabled = !row.enabled;
                    updateProductTimer(row).then(datas => {
                        let {message, code, data} = datas;
                        if (code !== "0") {
                            this.$message({
                                message: message,
                                type: 'error'
                            });
                        } else {
                            this.$message({
                                message: '操作成功',
                                type: 'info'
                            });
                            this.queryProductTimerPage();
                        }
                    });
                }).catch(() => {

                });
            },
            detailProduct(index,row){

                detailProductTimer(row).then(datas => {
                    let {message, code, data} = datas;
                    if (code !== "0") {
                        this.$message({
                            message: message,
                            type: 'error'
                        });
                    } else {
                        this.upproductsBatch = data;
                        this.matchFormBatchLoading = true;
                    }
                });
            },
            executeEnable(index,row){
                this.$confirm('确认执行此调价吗?', '提示', {
                    type: 'warning'
                }).then(() => {
                    executeProductTimer(row).then(datas => {
                        let {message, code, data} = datas;
                        if (code !== "0") {
                            this.$message({
                                message: message,
                                type: 'error'
                            });
                        } else {
                            this.$message({
                                message: '操作成功',
                                type: 'info'
                            });
                            this.queryProductTimerPage();
                        }
                    });
                }).catch(() => {

                });
            }
        },
        mounted() {
            this.findAllChannel();
            this.findAllDownShopInfo();
            this.findOpeProBusShop();
            this.queryProductTimerPage();
        }
    }

</script>

<style scoped>

</style>
